import { connect } from 'dva';
import styles from './index.less';
import { WingBlank,Button,InputItem,Toast,Modal } from 'antd-mobile';
import search from 'images/searchbar_search.png';
import router from 'umi/router';

const alert = Modal.alert;

function App({orderForGuestConfirm,dispatch}) {
    const { text,list } = orderForGuestConfirm;

    function click() {
        Toast.success('下单成功',1);
        router.push('mainpage')
    }

    return (
        <div>
            <div className={styles.first}>
                <div className={styles.text}>客户姓名</div>
                <div className={styles.input}>
                    <InputItem
                        clear
                        defaultValue="张三"
                        className={styles.input_style}
                        placeholder="请输入"
                        ></InputItem>
                </div>
            </div>
            
            <div className={styles.divider}> </div>

            <div className={styles.other}>
                <div className={styles.text}>联系电话</div>
                <div className={styles.input}>
                    <InputItem
                        clear
                        defaultValue="18877665566"
                        className={styles.input_style}
                        placeholder="请输入"
                        ></InputItem>
                </div>
            </div>

            <div className={styles.divider}> </div>

            <div className={styles.search_line}>
                <div className={styles.text_unique}>商品名称</div>
                <div className={styles.input}>
                    <InputItem
                        clear
                        defaultValue="iphone7plus 64g 银色"
                        className={styles.input_style}
                        ></InputItem>
                </div>
                <div className={styles.image}>
                    <img width="34px" height="36px" src={search} alt="" />
                </div>
            </div>

            <div className={styles.divider}></div>

            <div className={styles.other}>
                <div className={styles.text}>商品数量</div>
                <div className={styles.input}>
                    <InputItem
                        clear
                        defaultValue="1"
                        className={styles.input_style}
                        placeholder="请输入"
                        ></InputItem>
                </div>
            </div>

            <div className={styles.divider}></div>

            <div className={styles.address_input}>
                <div className={styles.other}>
                    <div className={styles.text}>收件地址</div>
                    <div className={styles.input}>
                        <InputItem
                            clear
                            defaultValue="福建省福州市鼓楼区西洪路666号"
                            className={styles.input_style}
                            placeholder="请输入"
                            ></InputItem>
                    </div>
                </div>
            </div> 

            <div className={styles.order_button}>
                <WingBlank>
                    <Button 
                        onClick={() => alert('确认信息无误，提交订单','',
                        [
                            { text: '修改', onPress: () => console.log('cancel') },
                            { text: '确认下单', onPress:click },
                        ])} 
                        className={styles.button}>下单</Button>
                </WingBlank>
            </div>       
            
        </div>
    );
}
export default connect(({orderForGuestConfirm})=>({orderForGuestConfirm}))(App);
